<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>引入方式</title>
    <style>
        p{
            font-size: 2em;
            color:blue;
        }
    </style>
    <!--<link rel="stylesheet" href="test.css">-->
    <style>
        @import "test.css";
    </style>
</head>
<body>
<!--
    行内式:通过style属性为当前元素设置css样式,一个style只能为一个元素设置
    内联样式:在head标签体中通过style标签定义内联样式
        此时定义的样式可以同时为多个元素设置统一的样式
    外部引入
        首先外部定义一个*.css的文件
        两种引入方式
        1.link标签引入
            在head标签体中使用link标签引入对应的css文件
        2.@import引入
            在head标签体的style标签中通过@import引入对应的css文件

    优先级问题
        行内式优先级最高
        外部引入与内联样式优先级一致
        当外部引入的样式与内联样式冲突时,谁在后,谁生效
        后面的样式覆盖了前面的样式
-->
<p style="color: red;">第1个段落</p>
<p style="color: green; font-size: 16px;">第2个段落</p>
<p>第3个段落</p>
<p>第4个段落</p>
<p>第5个段落</p>
<div>第1个div</div>
<div>第2个div</div>
<div>第3个div</div>
<div>第4个div</div>
<div>第5个div</div>
</body>
</html>